// 一区
$(function() {
	var myChart = echarts.init(document.getElementById('main1'));
	var option = {
		color: ['#FFCF76', '#1C9399'],
		legend: {
			selectedMode: false, //取消图例上的点击事件
			orient: 'vertical',
			right: '0',
			y: 'center',
			itemWidth: 10,
			itemHeight: 10,
			itemGap: 5, //图例之间的间距 
			textStyle: {
				color: '#333',
				fontSize: 12,
				padding: [3, 0, 0, 10]
			},
		},
		color: ['#FFCF76', '#1C9399'],
		series: [{
			name: '',
			type: 'pie',
			// 饼图的半径，数组的第一项是内半径，第二项是外半径
			radius: ['90px', '65px'],
			// 是否启用防止标签重叠策略
			avoidLabelOverlap: false,
			hoverAnimation: false,
			// 标签的视觉引导线样式，在 label 位置 设置为'outside'的时候会显示视觉引导线
			labelLine: {
				normal: {
					show: false
				}
			},
			data: [{
					value: 20,
					label: {
						normal: {
							// 是显示标签
							show: true,
							position: 'center',
							fontSize: 14,
							fontWeight: 'bold',
							//formatter: ['{c}','{d}'].join('\n'),
							formatter: ['入住：' +'{c}' , '入住率：' + '{d}' + '%'].join('\n\n'),
							textStyle: { //图例文字的样式
								color: '#333',
								fontSize: 14,
							},
						},
					},
				},
				{
					value: 100,
					label: {
						normal: {
							show: false,
		
						}
					},
					itemStyle: {
						normal: {
							color: '#1C9399'
						}, //正常颜色
						emphasis: {
							color: '#1C9399'
						}, //鼠标移入颜色
					},
				},
		
			]
		}]
	};
	myChart.setOption(option);
})

// 二区
$(function() {
	var myChart = echarts.init(document.getElementById('main2'));
	var option = {
		color: ['#FFCF76', '#1C9399'],
		legend: {
			selectedMode: false, //取消图例上的点击事件
			orient: 'vertical',
			right: '0',
			y: 'center',
			itemWidth: 10,
			itemHeight: 10,
			itemGap: 5, //图例之间的间距 
			textStyle: {
				color: '#333',
				fontSize: 12,
				padding: [3, 0, 0, 10]
			},
		},
		color: ['#FFCF76', '#1C9399'],
		series: [{
			name: '',
			type: 'pie',
			// 饼图的半径，数组的第一项是内半径，第二项是外半径
			radius: ['90px', '65px'],
			// 是否启用防止标签重叠策略
			avoidLabelOverlap: false,
			hoverAnimation: false,
			// 标签的视觉引导线样式，在 label 位置 设置为'outside'的时候会显示视觉引导线
			labelLine: {
				normal: {
					show: false
				}
			},
			data: [{
					value: 20,
					label: {
						normal: {
							// 是显示标签
							show: true,
							position: 'center',
							fontSize: 14,
							fontWeight: 'bold',
							//formatter: ['{c}','{d}'].join('\n'),
							formatter: ['入住：' +'{c}' , '入住率：' + '{d}' + '%'].join('\n\n'),
							textStyle: { //图例文字的样式
								color: '#333',
								fontSize: 14,
							},
						},
					},
				},
				{
					value: 100,
					label: {
						normal: {
							show: false,
		
						}
					},
					itemStyle: {
						normal: {
							color: '#1C9399'
						}, //正常颜色
						emphasis: {
							color: '#1C9399'
						}, //鼠标移入颜色
					},
				},
		
			]
		}]
	};
	myChart.setOption(option);
})
// 三区
$(function() {
	var myChart = echarts.init(document.getElementById('main3'));
	var option = {
		color: ['#FFCF76', '#1C9399'],
		legend: {
			selectedMode: false, //取消图例上的点击事件
			orient: 'vertical',
			right: '0',
			y: 'center',
			itemWidth: 10,
			itemHeight: 10,
			itemGap: 5, //图例之间的间距 
			textStyle: {
				color: '#333',
				fontSize: 12,
				padding: [3, 0, 0, 10]
			},
		},
		color: ['#FFCF76', '#1C9399'],
		series: [{
			name: '',
			type: 'pie',
			// 饼图的半径，数组的第一项是内半径，第二项是外半径
			radius: ['90px', '65px'],
			// 是否启用防止标签重叠策略
			avoidLabelOverlap: false,
			hoverAnimation: false,
			// 标签的视觉引导线样式，在 label 位置 设置为'outside'的时候会显示视觉引导线
			labelLine: {
				normal: {
					show: false
				}
			},
			data: [{
					value: 20,
					label: {
						normal: {
							// 是显示标签
							show: true,
							position: 'center',
							fontSize: 14,
							fontWeight: 'bold',
							//formatter: ['{c}','{d}'].join('\n'),
							formatter: ['入住：' +'{c}' , '入住率：' + '{d}' + '%'].join('\n\n'),
							textStyle: { //图例文字的样式
								color: '#333',
								fontSize: 14,
							},
						},
					},
				},
				{
					value: 100,
					label: {
						normal: {
							show: false,
		
						}
					},
					itemStyle: {
						normal: {
							color: '#1C9399'
						}, //正常颜色
						emphasis: {
							color: '#1C9399'
						}, //鼠标移入颜色
					},
				},
		
			]
		}]
	};
	myChart.setOption(option);
})
// 静养轩
$(function() {
	var myChart = echarts.init(document.getElementById('main4'));
	var option = {
		color: ['#FFCF76', '#1C9399'],
		legend: {
			selectedMode: false, //取消图例上的点击事件
			orient: 'vertical',
			right: '0',
			y: 'center',
			itemWidth: 10,
			itemHeight: 10,
			itemGap: 5, //图例之间的间距 
			textStyle: {
				color: '#333',
				fontSize: 12,
				padding: [3, 0, 0, 10]
			},
		},
		color: ['#FFCF76', '#1C9399'],
		series: [{
			name: '',
			type: 'pie',
			// 饼图的半径，数组的第一项是内半径，第二项是外半径
			radius: ['90px', '65px'],
			// 是否启用防止标签重叠策略
			avoidLabelOverlap: false,
			hoverAnimation: false,
			// 标签的视觉引导线样式，在 label 位置 设置为'outside'的时候会显示视觉引导线
			labelLine: {
				normal: {
					show: false
				}
			},
			data: [{
					value: 20,
					label: {
						normal: {
							// 是显示标签
							show: true,
							position: 'center',
							fontSize: 14,
							fontWeight: 'bold',
							//formatter: ['{c}','{d}'].join('\n'),
							formatter: ['入住：' +'{c}' , '入住率：' + '{d}' + '%'].join('\n\n'),
							textStyle: { //图例文字的样式
								color: '#333',
								fontSize: 14,
							},
						},
					},
				},
				{
					value: 100,
					label: {
						normal: {
							show: false,
		
						}
					},
					itemStyle: {
						normal: {
							color: '#1C9399'
						}, //正常颜色
						emphasis: {
							color: '#1C9399'
						}, //鼠标移入颜色
					},
				},
		
			]
		}]
	};
	myChart.setOption(option);
})
// 记忆家园
$(function() {
	var myChart = echarts.init(document.getElementById('main5'));
	var option = {
		color: ['#FFCF76', '#1C9399'],
		legend: {
			selectedMode: false, //取消图例上的点击事件
			orient: 'vertical',
			right: '0',
			y: 'center',
			itemWidth: 10,
			itemHeight: 10,
			itemGap: 5, //图例之间的间距 
			textStyle: {
				color: '#333',
				fontSize: 12,
				padding: [3, 0, 0, 10]
			},
		},
		color: ['#FFCF76', '#1C9399'],
		series: [{
			name: '',
			type: 'pie',
			// 饼图的半径，数组的第一项是内半径，第二项是外半径
			radius: ['90px', '65px'],
			// 是否启用防止标签重叠策略
			avoidLabelOverlap: false,
			hoverAnimation: false,
			// 标签的视觉引导线样式，在 label 位置 设置为'outside'的时候会显示视觉引导线
			labelLine: {
				normal: {
					show: false
				}
			},
			data: [{
					value: 20,
					label: {
						normal: {
							// 是显示标签
							show: true,
							position: 'center',
							fontSize: 14,
							fontWeight: 'bold',
							//formatter: ['{c}','{d}'].join('\n'),
							formatter: ['入住：' +'{c}' , '入住率：' + '{d}' + '%'].join('\n\n'),
							textStyle: { //图例文字的样式
								color: '#333',
								fontSize: 14,
							},
						},
					},
				},
				{
					value: 100,
					label: {
						normal: {
							show: false,
		
						}
					},
					itemStyle: {
						normal: {
							color: '#1C9399'
						}, //正常颜色
						emphasis: {
							color: '#1C9399'
						}, //鼠标移入颜色
					},
				},
		
			]
		}]
	};
	myChart.setOption(option);
})


// 性别比例
$(function() {
	var myChart = echarts.init(document.getElementById('main6'));
	var option = {
		color: ['#EB7E65', '#1C9399'],
		legend: {
			selectedMode: false, //取消图例上的点击事件
			orient: 'vertical',
			right: '30',
			y: 'center',
			itemWidth: 8,
			itemHeight: 8,
			itemGap: 10, //图例之间的间距 
			textStyle: {
				color: '#333',
				fontSize: 12,
				padding: [4, 0, 0, 10]
			},
		},
		series: [{
			name: '',
			type: 'pie',
			radius: 80,
			center: ['48%', 'center'],
			avoidLabelOverlap: false,
			//hoverAnimation:false,   //  防止点击变大事件   
			
			itemStyle: {
				normal: {
					label: {
						show: true,
						formatter: "{c}",
						textStyle: {
							color: '#333'
						},
						padding: [0, 0], //文字和图的边距
						rich: {
							b: { //value 文字样式
								fontSize: 12,
								lineHeight: 60,
								align: 'center',
								color: '#333'
							},
						}
					},
					show: true,
					borderColor: '#fff',
					borderWidth: 1,
				},
			},


			data: [{
					value: 335,
					name: '男'
				},
				{
					value: 250,
					name: '女',
				}
			],
		}],
	};
	myChart.setOption(option);
	// 默认高亮
	let index = 0; // 高亮索引
	myChart.dispatchAction({
		type: "highlight",
		seriesIndex: index,
		dataIndex: index
	});
	myChart.on("mouseover", function(e) {
		if (e.dataIndex != index) {
			myChart.dispatchAction({
				type: "downplay",
				seriesIndex: 0,
				dataIndex: index
			});
		}
	});
	myChart.on("mouseout", function(e) {
		index = e.dataIndex;
		myChart.dispatchAction({
			type: "highlight",
			seriesIndex: 0,
			dataIndex: e.dataIndex
		});
	});
})

// 文化程度
$(function() {
	var myChart = echarts.init(document.getElementById('main7'));
	var option = {
		color: ['#42C3AF', '#EB7E65','#73A0FA', '#A285D2','#83D0EF', '#1C9399','#F7C739'],
		legend: {
			selectedMode: false, //取消图例上的点击事件
			orient: 'vertical',
			right: '30',
			y: 'center',
			itemWidth: 8,
			itemHeight: 8,
			itemGap: 9, //图例之间的间距 
			textStyle: {
				color: '#333',
				fontSize: 12,
				padding: [4, 0, 0, 10]
			},
		},
		series: [{
			name: '',
			type: 'pie',
			radius: 70,
			center: ['45%', 'center'],
			avoidLabelOverlap: false,
			//hoverAnimation:false,   //  防止点击变大事件   
			
			itemStyle: {
				normal: {
					label: {
						show: true,
						formatter: "{c}",
						textStyle: {
							color: '#333'
						},
						padding: [0, 0], //文字和图的边距
						rich: {
							b: { //value 文字样式
								fontSize: 12,
								lineHeight: 60,
								align: 'center',
								color: '#333'
							},
						}
					},
					show: true,
					borderColor: '#fff',
					borderWidth: 1,
				},
			},


			data: [{
					value: 335,
					name: '文盲'
				},
				{
					value: 250,
					name: '小学',
				},{
					value: 335,
					name: '初中'
				},
				{
					value: 335,
					name: '高中'
				},
				{
					value: 335,
					name: '本科'
				},
				{
					value: 335,
					name: '硕士'
				},
				{
					value: 335,
					name: '博士'
				},
			],
		}],
	};
	myChart.setOption(option);
})

// 社保类型
$(function() {
	var myChart = echarts.init(document.getElementById('main8'));
	var option = {
		color: ['#42C3AF', '#EB7E65','#73A0FA', '#A285D2','#83D0EF', '#1C9399','#F7C739'],
		legend: {
			selectedMode: false, //取消图例上的点击事件
			orient: 'vertical',
			right: '30',
			y: 'center',
			itemWidth: 8,
			itemHeight: 8,
			itemGap: 9, //图例之间的间距 
			textStyle: {
				color: '#333',
				fontSize: 12,
				padding: [4, 0, 0, 10]
			},
		},
		series: [{
			name: '',
			type: 'pie',
			radius: [70,40],
			center: ['40%', 'center'],
			avoidLabelOverlap: false,
			hoverAnimation:false,   //  防止点击变大事件   
			labelLine: {
				normal: {
					length: 40, // 改变标示线的长度
					length2: 10,
				},
			},
			itemStyle: {
				normal: {
					label: {
						show: true,
						formatter: "{c}",
						textStyle: {
							color: '#333'
						},
						padding: [0, 0], //文字和图的边距
						rich: {
							b: { //value 文字样式
								fontSize: 12,
								lineHeight: 60,
								align: 'center',
								color: '#333'
							},
						}
					},
					show: true,
					borderColor: '#fff',
					borderWidth: 1,
				},
			},


			data: [{
					value: 335,
					name: '城保'
				},
				{
					value: 250,
					name: '镇保',
				},{
					value: 335,
					name: '居保'
				},
				{
					value: 335,
					name: '农保'
				},
				{
					value: 335,
					name: '其他（未满60周岁）'
				},
				{
					value: 335,
					name: '其他（特殊对象）'
				},
				{
					value: 335,
					name: '征地养老'
				},
			],
		}],
	};
	myChart.setOption(option);
})


// 护理等级
$(function(){
	// 基于准备好的dom，初始化echarts实例
    var myChart = echarts.init(document.getElementById('main9'));
    // 指定图表的配置项和数据
    var option = {
        grid: {
	    	top:'30',
            left: '0',   //图表距边框的距离
            right: '0',
            bottom: '0',
            containLabel: true
        },
	    xAxis: {
	        type: 'category',
	        /*boundaryGap: false,*/
	        
            axisLabel: {
                textStyle: {
                	color:'#fff',
                    fontSize: 12,
				},
            },
            axisTick:{
                show:false  //去掉y轴刻度线
            },
            
            //坐标轴颜色
            axisLine:{
                show:false
            },
	        data: ['轻度', '中度', '重度（一）', '重度（二）']
	    },
	    yAxis: [
		    {
		    	type: 'value',
		    	min:0,
                max:600,
                interval:200,
		        splitLine: {
	                show: true ,
		            lineStyle: {
		            	color: 'rgba(0, 0, 0, 0.15)',
		            	width: '1'
		            }
	            },
	            axisLabel: {
	            	textStyle: {
	            		color:'#fff',
	                    fontSize: 12,
					},
		            
	            },
	            
	            axisTick:{
	                show:false  //去掉y轴刻度线
	            },
		        //坐标轴颜色
	            axisLine:{
	                show:false,
	                lineStyle:{
	                    color:'#rgba(0, 0, 0, 0.15)',
                    	width:'1'
	                }
	            },
		    }
	    ],
	    series: [{
	        name:'',
            type:'bar',
            barWidth: '50',
            itemStyle : { 
				normal : {
					barBorderRadius:[2, 2, 0, 0],
					label: {		                       
						show: true,//是否展示
						position: 'top',
						textStyle: {
							fontSize: 14,		     
							color:'#333',
						}		                    
					},
					color: new echarts.graphic.LinearGradient(0, 1, 0, 0, [{
                        offset: 1,
                        color: '#1C9399'
                    }, {
                        offset: 0.3,
                        color: '#3CC5C9'
                    }]),
				}
			},
	        data: [110, 490, 320, 200,]
	    }]
	};
    // 使用刚指定的配置项和数据显示图表。
    myChart.setOption(option);
})